// 16位转rgb
function colorRgb(value) {
    // 16进制颜色值的正则
    var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/
    // 把颜色值变成小写
    var color = value ? value.toLowerCase() : '#fff'
    var rgbList = []
    if (reg.test(color)) {
        // 如果只有三位的值，需变成六位，如：#fff => #ffffff
        if (color.length === 4) {
            var colorNew = '#'
            for (var i = 1; i < 4; i += 1) {
                colorNew += color.slice(i, i + 1).concat(color.slice(i, i + 1))
            }
            color = colorNew
        }
        // 处理六位的颜色值，转为RGB
        for (var i = 1; i < 7; i += 2) {
            rgbList.push(parseInt('0x' + color.slice(i, i + 2)))
        }
    } else {
        rgbList = [255, 255, 255]
    }
    return rgbList
}
// 图片灰度转换
function toGray(data) {
    for (let i = 0; i < data.length; i += 4) {
        let r = data[i],
            g = data[i + 1],
            b = data[i + 2]

        // 计算灰度 并根据阈值转换为黑白两色
        const gray = 0.299 * r + 0.587 * g + 0.114 * b >= 128 ? 255 : 0
        data[i] = gray
        data[i + 1] = gray
        data[i + 2] = gray
    }
}
// 图片背景过滤
function filter(data, isTransparent, backgroundColor) {
    for (let i = 0; i < data.length; i += 4) {
        let r = data[i],
            g = data[i + 1],
            b = data[i + 2]

        // 色值在250-256之间都认为是白色
        if ([r, g, b].every(v => v < 256 && v > 250)) {
            if (isTransparent && typeof isTransparent === 'boolean') {
                data[i + 3] = 0 // 把背景改成透明
            } else {
                const bgColorRgbList = colorRgb(backgroundColor)
                data[i] = bgColorRgbList[0]
                data[i + 1] = bgColorRgbList[1]
                data[i + 2] = bgColorRgbList[2]
            }
        }
    }
}
/** 获取签名图片
 * @param {*} option
 *  @value url 图片源
 *  @value isTransparent 设置背景是否透明
 *  @value backgroundColor 设置背景色(isTransparent为true时, 背景色设置失效)
 * @param {*} cb 返回base64
 * @return {*} base64URL
 */
export default function (option, cb) {
    const { url, isTransparent, backgroundColor } = option || {}
    if (!url) return false
    let img = new Image()
    // 解决图片的跨域问题
    img.crossOrigin = 'Anonymous'
    img.src = url
    img.onload = function () {
        const canvasEL = document.createElement('canvas')
        const width = img.width
        const height = img.height
        canvasEL.width = width
        canvasEL.height = height
        const ctx = canvasEL.getContext('2d')
        ctx.drawImage(img, 0, 0, width, height)
        // 获取画布像素信息
        const imageData = ctx.getImageData(0, 0, width, height)
        const data = imageData.data
        toGray(data) // 这里对图像数据进行灰度处理
        filter(data, isTransparent, backgroundColor) // 这里对图像数据进行过滤处理

        // 把新的内容画进画布里
        ctx.putImageData(imageData, 0, 0)
        cb && cb(canvasEL.toDataURL('image/png', 1.0))
    }
}
